<template>
  <div class="content">
    <van-cell-group>
      <van-field v-model="value" placeholder="请输入用户名" class="input"/>
    </van-cell-group>
    <van-button type="info" @click="add" class="btn">添加商品</van-button>
  </div>
</template>
           
<script>
export default {
  data() {
    return {
      value: ""
    };
  },
  methods: {
    async add() {
      if (this.value.trim().length > 0) {
        const { data: res } = await this.$http.post("/api/addproduct", {
          name: this.value
        });
        if (res.status == 0) {
          this.$toast("添加成功");
          this.value = ''
        } else {
          this.$toast("添加失败 请重试！");
        }
      } else {
        this.$toast("内容不能为空！");
      }
    }
  }
};
</script>
<style lang="less" scoped>
.content {
  padding: 0 10px;
}
.input {
  padding: 10px 15px;
}
.btn {
  width: 100%;
  margin: 40px 0;
  font-size: 16px;
}
</style>
